const commontStyle = {
    lineHeight: 1,
    textAlign: 'left',
    rotate: 0,
}

//组件数据
export const componentsData = [
    {
        component: 'Dtext', // 组件名称，需要提前注册到 Vue
        label: '文字', // 左侧组件列表中显示的名字
        propLable: '双击编辑文字', // 组件所使用的值
        icon: '<el-icon><ChatLineSquare /></el-icon>', // 左侧组件列表中显示的名字
        style: { // 组件样式
            width: 200,
            height: 33,
            top: 0,
            left: 0,
            color: "#000",
            fontSize: "14px",
            ...commontStyle,
            animate: []
        },
        //事件
        events: []
    },
    {
        component: 'drag-button', // 组件名称，需要提前注册到 Vue
        label: '按钮', // 左侧组件列表中显示的名字
        propLable: '按钮', // 组件所使用的值
        icon: '<el-icon><Open /></el-icon>', // 左侧组件列表中显示的名字
        style: { // 组件样式
            top: 0,
            left: 0,
            width: 50,
            height: 20,
            ...commontStyle,
            animate: []
        },
        events: []
    },
    {
        component: 'Dimg', // 组件名称，需要提前注册到 Vue
        label: '图片', // 左侧组件列表中显示的名字
        propLable:"/src/img/222.png", // 组件所使用的值
        // propImg:"/src/img/meng.png",
        icon: '<el-icon><FullScreen /></el-icon>', // 左侧组件列表中显示的名字
        style: { // 组件样式
            top: 0,
            left: 0,
            width: 500,
            height: 500,
            ...commontStyle,
            animate: []
        },
        events: []
    },
      {
        component: 'drag-rect', // 组件名称，需要提前注册到 Vue
        label: '矩形', // 左侧组件列表中显示的名字
        propLable: "矩形", // 组件所使用的值
        icon: '<el-icon><FullScreen /></el-icon>', // 左侧组件列表中显示的名字
        style: { // 组件样式
            top: 0,
            left: 0,
            width: 180,
            height: 180,
            color:"#000",
            // background:"#000",
            border:"solid 1px #ccc",
            animate: []
        },
        events: []
    },
     
]